import { memo } from 'react'
import type { NodeProps } from 'reactflow'
import { NodeComponentMap } from '../constants'
import NodePanel from './panel'

export const CustomNode = memo((props: NodeProps) => {
  // console.log('CustomNode props', props)
  const nodeData = props.data
  const NodeComponent = NodeComponentMap[nodeData.type]

  return (
    <>
      <NodePanel {...props}>
        <NodeComponent />
      </NodePanel>
    </>
  )
})
CustomNode.displayName = 'CustomNode'

export default memo(CustomNode)
